<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<!--360浏览器优先以webkit内核解析-->
	<title>智慧社区管理系统</title>
	<link rel="shortcut icon" href="favicon.ico">
	<link href="../static/css/bootstrap.min.css" th:href="@{/css/bootstrap.min.css}" rel="stylesheet"/>
	<link href="../static/css/font-awesome.min.css" th:href="@{/css/font-awesome.min.css}" rel="stylesheet"/>
	<link href="../static/css/animate.min.css" th:href="@{/css/animate.min.css}" rel="stylesheet"/>
	<link href="../static/css/style.min.css" th:href="@{/css/style.min.css}" rel="stylesheet"/>
	<link href="../static/css/main.css" th:href="@{/css/main.css}" rel="stylesheet">
	<style type="text/css">
		.panel-group{margin-bottom: 0px !important;}
		.iboxDiv .ibox-content{min-height: 322px;}
		.bir ul{padding:0px;}
		.panel-personal .bottom i{margin-top: 0px !important;}
		.panel-personal .bottom h5{margin-top: 8px;margin-bottom: 8px;}
		.panel-personal .bottom div{align-items: center}
		.ibox-title_1 div.ibox-div{width: 19%;font-size: 20px;height: 60px;line-height: 60px;}
		.ibox-title_1 div.ibox-div h4{font-size: 16px;}
		.panel-development span{white-space: nowrap;}
		.panel-development span:last-child{text-overflow: ellipsis;overflow: hidden}
		.panel-nav .every-nav .font{background: none;}
		.inmodal .modal-header{padding:10px 15px}
		.showHand{
			cursor:pointer;
		}
		.yyjlDiv li{line-height: 32px;height: 32px;}
		.grxx .collapse.in{min-height: 250px;}
		.ibox-title_1{padding:15px;}
		.modal-footer .btn+.btn{margin-bottom: 5px;}
		.panel-personal .bottom .input{border:0;width: 69%}
	</style>
</head>

<body class="gray-bg">
<div class="wrapper wrapper-content">
	<div class="row">
		<div class="col-sm-3" th:each="titleObj:${topTitleList}">
			<div class="ibox float-e-margins" style="color: white;cursor:pointer;" th:tabName="${titleObj.targetTitle}"  name="butMenu" th:oncUrl="${titleObj.url}">
				<div class="ibox-title" th:style="${'background:'+titleObj.colour}">
					<i class="fa fa-hand-pointer-o" style="float: right;"></i>
					<h5 th:text="${titleObj.titleName}"></h5>
				</div>
				<div class="ibox-content" th:style="${'background:'+titleObj.colour}">
					<h1 class="no-margins" style="text-align: right" th:text="${#strings.isEmpty(titleObj.remark)?'0':titleObj.remark}"></h1>
					<spn th:text="${titleObj.targetTitle}"></spn>
					<div class="stat-percent font-bold">
					</div>
					<small>&nbsp;</small>
				</div>
			</div>
		</div>
		<!-- 顶部区域 -->
		<div class="col-sm-12">
			<div class="ibox float-e-margins">
				<div class="ibox-content_1 ibox-content no-padding" style="margin-top: 0px;">
					<div class="panel-body">
						<div class="panel-group" id="version">
							<div class="panel panel-default">
								<div class="panel-heading">
									<h5 class="panel-title">
										<a data-toggle="collapse" data-parent="#version" href="#v40">快捷服务</a>
									</h5>
								</div>
								<div id="v2" class="panel-collapse collapse in">
									<div class="panel-nav" id="panelMenu">
										<div class="every-nav col-sm-1" name="menuBut" th:each="m,status:${userMenus}" th:attr="data-id=${m.menuId},data-url=${m.url},data-name=${m.menuName} ">
											<div>
												<i class="fa every-font">
													<img src="../static/img/menu.png"  th:src="(${#strings.isEmpty(m.imgUrl)}) ? @{/img/menu.png} : @{${m.imgUrl}}" alt="" style="width: 50px;border-radius: 50%;height: 50px;">
												</i>
											</div>
											<h4 th:text="${m.menuName}"></h4>
										</div>
										<div class="every-nav more col-sm-1" onclick="goQuickService()">
											<div class="font" style="background: #669ef8">
												<i class="collect-button"></i>
												<i class="fa fa-ellipsis-h every-font"></i>
											</div>
											<h4>更多</h4>
										</div>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>

		<!-- 个人信息模块 -->
		<div class="grxx">
			<div class="col-sm-3 iboxDiv" style="padding-right: 0px;">
				<div class="ibox-content no-padding">
					<div class="panel-body">
						<div class="panel-group">
							<div class="panel panel-default">
								<div class="panel-heading">
									<h5 class="panel-title">
										<a data-toggle="collapse" data-parent="#version" href="#v40">个人信息</a>
									</h5>
								</div>
								<div  class="panel-collapse collapse in">
									<div class="panel-personal">
										<div class="top " >
											<img th:src="(${#strings.isEmpty(user.avatar)}) ? @{/img/profile.jpg} : @{${user.avatar}}"
												 class="img-circle showHand" alt="用戶头像" style="width: 50px;border-radius: 50%;height: 50px;" title="个人中心" tabName="个人中心" name="butMenu" oncUrl="basedata/user/profile">
											<div class="right">
												<h5  th:text="${user.loginName}"></h5>
												<h5 th:text="${user.userName}">
													<i class="fa fa-venus"></i>
													<i class="'fa fa=mercury"></i>
												</h5>
												<h5 th:text="${dep?.deptName}">离退休工作处</h5>
											</div>
										</div>
										<div class="bottom">
											<div>
												<i class="fa fa-mobile-phone"></i>
												<h5>手机：</h5>
												<span class="input" th:text="${user.phonenumber}"></span>
											</div>
											<div>
												<i class="fa fa-envelope-o"></i>
												<h5>邮箱：</h5>
												<span class="input" th:text="${user.email}"></span>
											</div>
										</div>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>

			<!-- 通知公告模块 -->
			<div class="col-sm-5 iboxDiv" id="xtgg" style="padding-right: 0px;">
				<div class="ibox-content no-padding">
					<div class="panel-body">
						<div class="panel-group">
							<div class="panel panel-default">
								<div class="panel-heading ">
									<h5 class="panel-title Announcements-title">
										<a data-toggle="collapse" data-parent="#version" href="#v40">通知公告</a>
										<a href="javacript:void(0);" style="color:#0985e0" id="gdgg"  >更多 &raquo;</a>
									</h5>
								</div>
								<div  class="panel-collapse Announcements collapse in">
									<div class="new">
										<div class="panel-Announcements" th:each="item,itemStat:${notlist}"  name="ggMenu" th:attr="data-id=${item.noticeId}" >
											<h4 title="查看通知公告" class="title showHand" th:text="${item.noticeTitle}"></h4>
											<h5  th:text="${#dates.format(item.createTime, 'MM-dd')}"></h5>
										</div>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>

			<!-- 待办事项 -->
			<div class="col-sm-4 iboxDiv">
				<div class="ibox-content no-padding">
					<div class="panel-body">
						<div class="panel-group">
							<div class="panel panel-default">
								<div class="panel-heading ">
									<h5 class="panel-title development-title">
										<a data-toggle="collapse" data-parent="#version" href="#v40">待办事项</a>
										<a href="javacript:void(0);" style="color:#0985e0" id="gdrz" class="hidden">更多 &raquo;</a>
									</h5>
								</div>
								<div  class="panel-collapse development collapse in">
									<div class="panel-development" th:each="item,itemStat:${nlogs} ">
										<i class="fa fa-clock-o font"></i>
										<span th:text="${item.xcsjMsg}">0秒前</span>
										<span class="tag" th:text="${item.userName}">匿名用户</span>
										<span  th:text="${item.type==0?'访问了':'登录了系统'}"></span>
										<span class="tag" th:text="${item.title}"></span>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
		<div style="clear: both"></div>
	</div>
</div>
<!-- 生日提醒窗口 -->
<div class="text-center" style="display: none;">
	<button type="button" class="btn btn-primary" data-toggle="modal" id="showSrtxMsg" data-target="#myModal">
	</button>
</div>
<div class="modal inmodal" id="myModal" tabindex="-1" role="dialog" aria-hidden="true">
	<div class="modal-dialog">
		<div class="modal-content animated bounceInRight">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span
						class="sr-only">关闭</span>
				</button>
				<h4 class="modal-title">最近有退休人员生日</h4>
				<small class="font-bold"></small>
			</div>
			<div class="modal-body" id="srtxry" style="width: 100%;height:200px;">

			</div>
			<div class="modal-footer">
				<button type="button" class="btn btn-primary" data-dismiss="modal">我知道了</button>
				<button type="button" class="btn btn-white" id="srgl">更多</button>
			</div>
		</div>
	</div>
</div>
<script th:inline="javascript"> var ctx = [[@{/}]]; </script>
<script th:src="@{/js/jquery.min.js}"></script>
<script th:src="@{/ajax/libs/layer/layer.min.js}"></script>
<script th:src="@{/js/bootstrap.min.js}"></script>
<script th:src="@{/ruoyi/js/common.js?v=4.0.0}"></script>
<script th:src="@{/ruoyi/js/ry-ui.js}"></script>

<script type="text/javascript">
	$(function(){
		//跳转按钮
		$('#panelMenu').delegate("[name=menuBut]","click",function(e){
			e.stopPropagation();
			var url=$(this).attr("data-url");
			var name=$(this).attr("data-name");
			$.modal.openTab(name, ctx +url.substr(1));
		});

		//点击收藏按钮
		$('#panelMenu').delegate("[name=scMenu]","click",function(e){
			e.stopPropagation();
			var index= layer.load(1, {
				shade: [0.1,'#fff'] //0.1透明度的白色背景
			});
			var id=$(this).attr("data-menuId");
			var _this=$(this);
			$.post('../system/favorite/sccd',{fkMenuId:id},function(res){
				layer.close(index);
				if(res.code==0){
					if(_this.hasClass('fa-star-o')){
						$.modal.alertSuccess('收藏成功！');
						_this.removeClass('fa-star-o').addClass('fa-star');
					}else{
						$.modal.alertSuccess('取消收藏成功！');
						_this.removeClass('fa-star').addClass('fa-star-o');
					}
				}else{
					$.modal.alertError('操作失败，请联系管理员！');
				}

			});
		});

		//更多公告
		$("#gdgg").on("click",function(){
			$.modal.openTab('我的通知公告消息', ctx +'system/notice');
		});

		//公告详情
		$("#xtgg").delegate("[name=ggMenu]","click",function(e){
			e.stopPropagation();
			var id=$(this).attr("data-id");
			layer.open({
				type: 2,
				area: ['600px','500px'],
				fix: false,
				//不固定
				maxmin: true,
				shade: 0.3,
				title: '查看公告通知',
				content: ctx +'system/notice/detail/'+id,
				btn: ['关闭'],
				// 弹层外区域关闭
				// shadeClose: true,
				cancel: function (index) {
					return true;
				},
			});
		});

		$("[name=butMenu]").click(function(){
			var url=$(this).attr("oncUrl");
			if(url=="" || url=="#")
				return;
			var name=$(this).attr("tabName");
			$.modal.openTab(name,  ctx +url);
		})

	});

	function goQuickService() {
		var url = ctx + 'system/more';
		$.modal.openTab("快捷服务", url);
	}
</script>
</body>
</html>
